<template>
  <div>
    <ReturnPage />
    <div
      style="height: 400px; background-color: white; padding: 40px"
      class="mt10"
    >
      <el-descriptions title="告警详情">
        <el-descriptions-item label="主机">{{
          form.host
        }}</el-descriptions-item>
        <el-descriptions-item label="触发器">{{
          form.relatedObject.description
        }}</el-descriptions-item>
        <el-descriptions-item label="严重性">{{
          form.relatedObject.priority | getSeverity
        }}</el-descriptions-item>
        <el-descriptions-item label="问题表现形式">{{
          form.relatedObject.expression
        }}</el-descriptions-item>
        <el-descriptions-item label="事件生成">正常</el-descriptions-item>
        <el-descriptions-item label="允许手动关闭">{{
          form.relatedObject.manual_close | getmanualclose
        }}</el-descriptions-item>
        <el-descriptions-item label="已启用">{{
          form.relatedObject.status | getstatus
        }}</el-descriptions-item>
        <el-descriptions-item label="事件">{{
          form.name
        }}</el-descriptions-item>
        <el-descriptions-item label="Operational data">{{
          form.description
        }}</el-descriptions-item>
        <el-descriptions-item label="时间">{{
          form.occurTime
        }}</el-descriptions-item>
        <el-descriptions-item label="已确认">{{
          form.acknowledged | getacknowledged
        }}</el-descriptions-item>
        <el-descriptions-item label="处理方法">触发器</el-descriptions-item>
        <el-descriptions-item label="标记">{{
          this.tags
        }}</el-descriptions-item>
        <el-descriptions-item label="描述">{{
          form.relatedObject.description
        }}</el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
</template>
 
<script>
import {
  getDetailApi, //告警管理列表查询
} from "@/api/dataPresentation/alarmCategory.js";
import ItemVue from "../../../layout/components/Sidebar/Item.vue";
export default {
  name: "Detail",
  data() {
    return {
      eventid: this.$route.query.eventid,
      form: {
        host: "",
        severity: "",
        name: "",
        description: "",
        occurTime: "",
        acknowledged: "",
        relatedObject: {
          description: "",
          priority: "",
          expression: "",
          value: "",
          status: "",
          description: "",
        },
      },
      tags: "",
    };
  },
  methods: {
    getListData() {
      getDetailApi(this.eventid).then((res) => {
        this.form = res.data;
        this.tags = res.data.tags
          .map((item) => {
            return item.tag + ":" + item.value;
          })
          .toString();
      });
    },
  },
  created() {
    this.getListData();
  },
  filters: {
    //过滤严重性
    getSeverity(val) {
      switch (val) {
        case 0:
          return "未分类";
        case 1:
          return "信息";
        case 2:
          return "警告";
        case 3:
          return "一般严重";
        case 4:
          return "严重";
        case 5:
          return "灾难";
      }
    },
    getstatus(val) {
      switch (val) {
        case 0:
          return "启动";
        case 1:
          return "禁用";
      }
    },
    getmanualclose(val) {
      switch (val) {
        case 0:
          return "不允许";
        case 1:
          return "允许";
      }
    },
    getacknowledged(val) {
      switch (val) {
        case 0:
          return "不";
        case 1:
          return "否";
      }
    },
  },
};
</script>
<style scoped>
</style>